//职员管理

import React, {Component} from 'react';
import app from '../app';
import {Form, Input, Button, Table, Modal, Row, Upload, Icon, DatePicker, Select, Pagination} from 'antd';
import {activity,collage} from '../value';
import '../css/other.css';
import moment from 'moment';
import {config} from "../config";

import {Editor} from 'react-draft-wysiwyg';
import {EditInvitationActivitys} from "../components/operateManage";

const FormItem = Form.Item;
const confirm = Modal.confirm;
const RangePicker = DatePicker.RangePicker;
const Option = Select.Option;

class TeamBuyingList extends Component {
    constructor(props) {
        super(props);
        this.state = {
            searchData: {},
            pagination: {current: 1, pageSize: 10, total: 0},
            data: [],
            currentPageSize: 0,
            pageCount: 0,
            imgUrl: '',
        }
    }

    columns = [
        {
            title: '序号',
            dataIndex: 'order_number'
        },
        {
            title: '活动名称',
            dataIndex: 'collage_name'
        },
        {
            title: '开始时间',
            dataIndex: 'collage_startTime',
            render: collage_startTime => {
                return (
                    <span>{moment(collage_startTime).format('YYYY-MM-DD')}</span>
                )
            }
        },
        {
            title: '结束时间',
            dataIndex: 'collage_endTime',
            render: collage_endTime => {
                return (
                    <span>{moment(collage_endTime).format('YYYY-MM-DD')}</span>
                )
            }
        },
        {
            title: '拼单人数',
            dataIndex: 'collage_number'
        },
        {
            title: '创建时间',
            dataIndex: 'collage_createTime',
            render: activity_createTime => {
                return (
                    <span>{moment(activity_createTime).format('YYYY-MM-DD HH:mm:ss')}</span>
                )
            }
        },
        {
            title: '已拼(件)',
            dataIndex: 'collage_buyCount'
        },
        {
            title: '状态',
            dataIndex: 'collage_status',
            render: collage_status => {
                let text = '';
                if (collage_status === '1') {
                    text = '未开始';
                } else if (collage_status === '2') {
                    text = '进行中';
                } else if (collage_status === '3') {
                    text = '已结束';
                }else if (collage_status === '4') {
                    text = '已停用';
                }
                return (
                    <span>{text}</span>
                )
            }
        },
        {
            title: '操作',
            dataIndex: this.columns,
            render: data => {
                return (
                    <div>
                        <Button type={'primary'} onClick={()=>this.handleRedirectToActivityEdit(data.collage_id)}>编辑</Button>
                        {
                            data.collage_isable === '1' ? <Button style={{marginLeft: '10px'}} type="danger"
                                                                     onClick={() => this.handleUpdateCollageIsAble(data.collage_id, 0)}>停用</Button> :
                                <Button style={{marginLeft: '10px'}} type="primary"
                                        onClick={() => this.handleUpdateCollageIsAble(data.collage_id, 1)}>启用</Button>
                        }
                        <Button style={{marginLeft: '10px'}} type="danger"
                                onClick={() => this.handleUpdateCollageIsAble(data.collage_id, 2)}>删除</Button>
                    </div>
                )
            }
        },
    ];

    render() {
        // const rowSelection = {
        //     // 表格中复选框发生变化时
        //     onChange: (selectedRowKeys, selectedRows) => {
        //         let positionId = [];
        //         let positionName = [];
        //         positionId = selectedRowKeys;
        //         selectedRows.forEach((item) => {
        //             positionName.push(item.role_name);
        //         });
        //         this.setState({
        //             positionId: positionId,  //批量选中的职位ID
        //             positionName: positionName,
        //             selectCount: selectedRowKeys.length, //一共选择的职位数量
        //         })
        //     },
        //
        // };
        const {pagination, currentPageSize} = this.state;
        return (
            <div style={{paddingBottom: 25}}>
                <div className="pageTitle">
                    团购活动列表
                </div>
                <Button type={'primary'} style={{marginTop: 10}}
                        onClick={() => this.handleRedirectToActivityAdd()}>新建团购活动</Button>
                <Row style={{marginTop: '20px'}}>
                    <Table
                        columns={this.columns}
                        rowKey={(record, index) => index}
                        dataSource={this.state.data}
                        loading={this.state.loading}
                        pagination={false}
                        onChange={this.handleTableChange}
                    />
                </Row>
                <Row style={{textAlign: 'right', marginTop: 20}}>
                    <Pagination {...pagination} showSizeChanger showQuickJumper
                                onChange={(page, pageSize) => this.handlePageOnChange(page, pageSize)}
                                onShowSizeChange={(current, size) => this.handleOnShowSizeChange(current, size)}/>
                </Row>
            </div>
        )
    }

    /**
     * 初始化
     */
    componentDidMount() {
        const param = {page: 1, size: 10};
        this.searchCollageList(param);
    }

    /**
     * 获取搜索条件
     */
    handleGetValue(data) {
        console.log(data);
        let startTime = '';
        let endTime = '';
        if (data.date && data.date.length > 0) {
            startTime = moment(data.date[0]._d).format('YYYY-MM-DD HH:mm:ss');
            endTime = moment(data.date[1]._d).format('YYYY-MM-DD HH:mm:ss');
        }
        const searchData = {
            startTime,
            endTime,
            nameSearch: data.activity_name,
            statusSearch: data.status
        };
        this.setState({searchData});
        const param = {
            page: 1,
            size: 10,
            ...searchData
        };
        this.searchActivityList(param);
    }

    /**
     * 处理创建后刷新事件
     */
    handleRefreshAfterCreate() {
        const param = {};
        this.searchProject(param);
    }

    /**
     * 处理删除后刷新事件
     */
    handleRefreshAfterDelete() {
        const param = {
            page:1,
            size:10
        };
        this.searchCollageList(param);
    }

    /**
     * 处理更新后刷新事件
     */
    handleRefreshAfterUpdate() {
        const {pagination} = this.state;
        const param = {
            page:pagination.current,
            size:pagination.pageSize
        };
        this.searchCollageList(param);
    }

    /**
     * 处理页码、显示数量变化事件
     * @param pagination
     * @param filters
     * @param sorter
     */
    handleTableChange = (pagination, filters, sorter) => {
        const current = pagination.current;
        const size = pagination.pageSize;
        const pagination1 = this.state.pagination;
        pagination1.current = current;
        pagination1.pageSize = size;
        this.setState({pagination: pagination1});
    };

    /**
     * 处理页码变化事件
     * @param page
     * @param pageSize
     */
    handlePageOnChange(page, pageSize) {
        console.log(page, pageSize);
        const param = {
            page,
            size: pageSize
        };
        this.searchCollageList(param);
    }

    /**
     * 处理数量变化事件
     * @param current
     * @param size
     */
    handleOnShowSizeChange(current, size) {
        console.log(current, size);
        const param = {
            page: current,
            size
        };
        this.searchCollageList(param);
    }

    /**
     * 查找团购活动列表
     * @param param
     */
    searchCollageList(param) {
        let _this = this;
        _this.setState({loading: true});
        app.post(collage.SEARCH_COLLAGE_LIST, param).then(result => {
            if (result.code === 1) {
                const data = result.data;
                for (let i = 0; i < data.length; i++) {
                    data[i].order_number = i + 1;
                }
                const pagination = {total: result.count, current: param.page, pageSize: param.size};
                this.setState({pagination, data: data, loading: false});
            } else {
                app.alert(result.msg, 'success', 1);
                const pagination = {total: 0, current: 0, pageSize: 0};
                this.setState({pagination, data: [], loading: false});
            }
        });
    }

    /**
     * 更新活动状态
     * @param id
     */
    handleUpdateCollageIsAble(id,type) {
        let _this = this;
        if(type===2){
            confirm({
                content: '您确定要删除该活动吗？',
                onOk() {
                    app.post(collage.UPDATE_COLLAGE_ISABLE, {collage_id: id,collage_isable:'2'}).then((res) => {
                        if (res.code === 1) {
                            app.alert("删除成功", 'success', 1);
                            _this.handleRefreshAfterDelete();
                        } else {
                            app.alert(res.msg, 'error', 1);
                        }
                    })
                },
                onCancel() {
                },
            });
        }else if(type===0){
            confirm({
                content: '您确定要停用该活动吗？',
                onOk() {
                    app.post(collage.UPDATE_COLLAGE_ISABLE, {collage_id: id,collage_isable:'0'}).then((res) => {
                        if (res.code === 1) {
                            app.alert("停用成功", 'success', 1);
                            _this.handleRefreshAfterUpdate();
                        } else {
                            app.alert(res.msg, 'error', 1);
                        }
                    })
                },
                onCancel() {
                },
            });
        }else if(type===1){
            app.post(collage.UPDATE_COLLAGE_ISABLE, {collage_id: id,collage_isable:'1'}).then((res) => {
                if (res.code === 1) {
                    app.alert("启用成功", 'success', 1);
                    _this.handleRefreshAfterUpdate();
                } else {
                    app.alert(res.msg, 'error', 1);
                }
            })
        }
    }

    /**
     * 跳转到新增满减活动页面
     */
    handleRedirectToActivityAdd() {
        this.props.history.push(config.path + '/home/teamBuying');
    }

    /**
     * 跳转到编辑活动页面
     */
    handleRedirectToActivityEdit(id){
        this.props.history.push(config.path + '/home/teamBuyingEdit/'+id);
    }
}

const TeamBuyingLists = Form.create()(TeamBuyingList);

export default TeamBuyingLists


